<template>
	<view class="app-card">
		<view @click="choose(index)" :key="index" v-for="(item,index) in problem">
			<myredio :checked="state[index]" :padding="10" :title="item" />
		</view>
	</view>
</template>

<script>
	const problem = [
		'1.地面不整洁，垃圾未清理',
		'2.洗漱台无序，水槽有污垢',
		'3.便池不清洁，空气有异味',
		'4.被子未叠正，床帷未拉开',
		'5.桌面较凌乱，书柜欠整齐',
		'6.衣服未挂齐，鞋子乱摆放',
		'7.阳台堆杂物，门窗有积灰',
		'8.有大功率电器',
		'9.有饲养宠物',
		'10.有管制刀具',
		'11.有酒瓶',
	];
	const field = ['floor','pentrough','toilet','bed','desk','clothes','balcony','electrical','pet','knife','bottle']
	const state = [false, false, false, false, false, false, false, false, false, false, false]
	import myredio from '../../../components/radio.vue'
	export default {
		props:['resObj'],
		data() {
			return {
				problem,
				state,
				field,
				res:{}
			}
		},
		mounted() {
			this.state = this.state.map( ele => false)
			if(Object.keys(this.resObj).length > 0){
				const newstate = [];
				this.field.forEach( ele => {
					for (let s in this.resObj) {
						if(ele === s){
							newstate.push(this.resObj[ele])
							return
						}
					}
				})
				this.state = newstate;
			}
			this.createres()
		},
		methods:{
			choose(index){
				this.state[index] = !this.state[index]
				this.createres()
				this.$emit('change',this.res)
				this.$forceUpdate()
			},
			createres(){
				this.field.forEach( (ele,index) => {
					this.res[ele] = this.state[index]
				})
			}
		},
		components: {
			myredio
		}
	}
</script>

<style>
</style>
